<div nz-row>
  <div nz-col nzSpan="24">
    <div class="table-operations">
      <button nz-button (click)="addRule()">新增标签规则</button>
    </div>
    <nz-table #nestedTable [nzData]="ruleVOS" [nzPageSize]="10">
      <thead>
        <tr>
          <th></th>
          <th>id</th>
          <th>名称</th>
          <th>状态</th>          
          <th>窗口</th>
          <th>窗口时长</th>
          <th>水位线（秒）</th>
          <th style="width:30%">条件</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        <ng-template ngFor let-data [ngForOf]="nestedTable.data">
          <tr>
            <td [(nzExpand)]="data.expand"></td>
            <td>{{ data.id }}</td>
            <td><a (click)="modifyRule(data.id)">{{ data.name }}</a></td>
            <td>{{ data.ruleState }}</td>
            <td>{{ data.windowType }}</td>
            <td>{{ data.windowSize }}</td>
            <td>{{ data.waterMark }}</td>
            <td>{{ data.tags | json}}</td>
            <td *ngIf="data.ruleState == '激活'">
              <a (click)="modifyRuleState(data.id, data.ruleState)">停止</a>              
          </td>
          <td *ngIf="data.ruleState == '停止'">
              <a (click)="modifyRuleState(data.id, data.ruleState)">激活</a>
          </td>
          </tr>
          <tr [nzExpand]="data.expand">
            <nz-table #innerTable [nzData]="data.ruleMetricConditionVOs" nzSize="middle" [nzShowPagination]="false">
              <thead>
                <tr>
                  <th>指标</th>
                  <th>统计函数</th>
                  <th>操作符</th>
                  <th>阀值</th>
                </tr>
              </thead>
              <tbody>
                <tr *ngFor="let data of innerTable.data">
                  <td>{{ data.metric }}</td>
                  <td>{{ data.aggregatorFunctionType }}</td>
                  <td>{{ data.limitOperatorType }}</td>
                  <td>{{ data.limit }}</td>                  
                </tr>
              </tbody>
            </nz-table>
          </tr>
        </ng-template>
      </tbody>
    </nz-table>
  </div>
</div>
